<template>
	<view class="content">
		<swiper class="swiper" :autoplay="autoplay" :duration="duration">
			<swiper-item><image src="../../static/index_1.png" mode="" class="swiper_img"></image></swiper-item>
			<swiper-item><image src="../../static/index_2.png" mode="" class="swiper_img"></image></swiper-item>
			<swiper-item>
				<view class="login_box">
					<image src="../../static/index_icon.png" mode="" class="icon1"></image>
					<image src="../../static/index_icon2.png" mode="" class="icon2"></image>
					<text class="btn login" @click="toLogin">登录</text>
					<text class="btn register" @click="toRegister">注册</text>
					<image src="../../static/login_bottom.png" mode="" class="bottom"></image>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
export default {
	data() {
		return {
			background: ['color1', 'color2', 'color3'],
			autoplay: false,
			duration: 500,
			jumpover: '跳过'
		};
	},
	methods: {
		launchFlag() {
			/**
			 * 向本地存储中设置launchFlag的值，即启动标识；
			 */
			uni.setStorage({
				key: 'launchFlag',
				data: true
			});
			uni.switchTab({
				url: '/pages/main/main'
			});
		},
		toLogin() {
			uni.navigateTo({
				url: '../../pages/login/login'
			})
		},
		toRegister() {
			uni.navigateTo({
				url: '../../pages/register/register'
			})
		}
	}
};
</script>
<style scoped>
page,
.content {
	width: 100%;
	height: 100vh;
	padding: 0;
}
.swiper {
	width: 100%;
	height: 100%;
}
.swiper_img {
	width: 100%;
	height: 100%;
}

.login_box {
	width: 100%;
	height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

.icon1 {
	width: 200upx;
	height: 200upx;
	margin: 200upx 0 16upx 0;
}

.icon2 {
	width: 276upx;
	height: 106upx;
	margin-bottom: 200upx;
}

.btn {
	padding: 24upx 166upx;
	font-size: 34upx;
	border-radius: 100upx;
	border: 2upx solid #373846;
}
.login {
	background: #373846;
	color: #FFFFFF;
	margin-bottom: 48upx;
}
.register {
	color: #373846;
}
.bottom {
	width: 100%;
	height: 223upx;
	position: absolute;
	bottom: 0;
	left: 0;
}
</style>
